<template>
  <Row class="full-height" style="overflow: hidden;">
    <Col :span="16" class="full-height" style="padding-right: 10px;">
        <Dagre class="white-background"/>
    </Col>
    <Col :span="8" class="full-height">
      <!-- <ScenceDetail style="height: 50%;" /> -->
      <TabCharts style="height: 50%;" />
      <TopologyDetail class="white-background" style="height: 50%;"/>
    </Col>
  </Row>
</template>

<script lang="ts">
import { defineComponent } from "vue";
import {Row, Col} from 'ant-design-vue';
import Topology from "./components/Topology.vue";
import TopologyDetail from "./components/TopologyDetail.vue";
import ScenceDetail from "./components/ScenceDetail.vue";
import TabCharts from "./components/TabCharts.vue";
import Dagre from "./components/Dagre.vue";
export default defineComponent({
    components:{
        Row,
        Col,
        Topology,
        TopologyDetail,
        ScenceDetail,
        Dagre,
        TabCharts,
    },
    setup(){
        return {

        }

    }
})
</script>

<style lang="less">
.white-background{
  background: white;
}
</style>